<script setup>
import { ref } from "vue";
import { RouterLink, RouterView } from "vue-router";
import HelloWorld from "./components/HelloWorld.vue";
import { useQuery } from "vue-query";
import * as _ from "lodash";
import oss from "@/api/oss";
import oa from "@/api/oa";

import dayjs from "dayjs";
import { useCounterStore } from "@/stores/counter.js";
useQuery("wzt", () => {
  oss.uploadFile();
});
const useCounter = useCounterStore();
var array = [1];
var other = _.concat(array, 2, [3], [[4]]);

console.log(other, dayjs().format(), useCounter);
// useCounter.count = 20;

const butn = ref("sdf");
butn.value = "wztttt";
const changeBtn = () => {
  butn.value = "王正婷";
  useCounter.count = 40;
};
useQuery("sdaf", () => {
  oa.getSendMsgList();
});

const checkboxList = [
  {
    name: "苹果",
    disabled: false,
    aa: 1,
    acv: 2,
  },
  {
    name: "香蕉",
    disabled: false,
  },
  {
    name: "橙子",
    disabled: false,
  },
];

let a = _.find(checkboxList, (m) => m.name == "苹果" && m.aa == "1");
console.log(a, "dsfasd");
</script>

<template>
  tailwindcss
  <h1 class="text-3xl font-bold underline text-blue-600">Hello world!</h1>
  <p class="text-[red]">The quick brown fox...</p>
  <header>
    <img
      alt="Vue logo"
      class="logo"
      src="@/assets/logo.svg"
      width="125"
      height="125"
    />
    <van-button type="primary">主要按钮</van-button>
    <van-button type="success">成功按钮</van-button>
    <van-button type="default">默认按钮</van-button>
    <van-button type="warning">警告按钮</van-button>
    <van-button type="danger">危险按钮</van-button>
    <van-row>
      <van-col span="8">span: 8</van-col>
      <van-col span="8">span: 8</van-col>
      <van-col span="8">span: 8</van-col>
    </van-row>

    <van-row>
      <van-col span="4">span: 4</van-col>
      <van-col span="10" offset="4">offset: 4, span: 10</van-col>
    </van-row>

    <van-row>
      <van-col offset="12" span="12">offset: 12, span: 12</van-col>
    </van-row>
    <div class="wrapper">
      <HelloWorld msg="You did it!" />

      <nav>
        <RouterLink to="/">Home</RouterLink>
        <RouterLink to="/about">About</RouterLink>
      </nav>
    </div>
  </header>
  <van-space>
    <van-button type="primary">{{ butn }}</van-button>
    <van-button type="primary" @click="changeBtn">按钮</van-button>
    <van-button type="primary">按钮</van-button>
    <van-button type="primary">按钮</van-button>
  </van-space>
  <br />
  <van-space direction="vertical" fill>
    <van-button type="primary" block>按钮</van-button>
    <van-button type="primary" block>按钮</van-button>
    <van-button type="primary" block>按钮</van-button>
  </van-space>
  <RouterView />
</template>
<style scoped>
header {
  line-height: 1.5;
  max-height: 100vh;
}

.logo {
  display: block;
  margin: 0 auto 2rem;
}

nav {
  width: 100%;
  font-size: 12px;
  text-align: center;
  margin-top: 2rem;
}

nav a.router-link-exact-active {
  color: var(--color-text);
}

nav a.router-link-exact-active:hover {
  background-color: transparent;
}

nav a {
  display: inline-block;
  padding: 0 1rem;
  border-left: 1px solid var(--color-border);
}

nav a:first-of-type {
  border: 0;
}
</style>
